<!DOCTYPE html>
<html>
<head>
	<title>个人中心</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<link rel="stylesheet" href="../css/weui.min.css">
	<link rel="stylesheet" href="../css/jquery-weui.min.css">
	<link rel="stylesheet" href="../css/main.css">
	<style>
		.user-top{
			text-align: center;
			position: relative;
			background-color:rgba(255, 255, 255,0.5)
		}
		#canvas{
			position: absolute;
		}
		.user-top_sec{
			align-self:center;
			-moz-align-self:center;
			-webkit-align-self:center;
		}
		.user-top_sec img{
			width: 80px;
			border-radius: 50%;
			-moz-border-radius: 50%;
			-webkit-border-radius: 50%;
		}
		.weui-navTab{height: auto;}
	</style>
</head>
<body>
	<div id="app">
		<div class="weui-tab">
			<div class="weui-tab__bd">
				<div class="weui-flex user-top">
					<section class="weui-flex__item user-top_sec">
						<img src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=16550438,2220103346&fm=27&gp=0.jpg" alt="">
						<p>王大锤</p>
					</section>
					<canvas id="canvas" width="300" height="200"></canvas>
				</div>
				<div class="user-center">
					<div class="weui-cells">
					  <a class="weui-cell weui-cell_access" href="javascript:;">
					  	<div class="weui-cell__hd">
					  		<img src="" style="width: 20px;margin-right: 5px;display: block;"></div>
					    <div class="weui-cell__bd">
					      <p>常州武进实验小学</p>
					    </div>
					    <div class="weui-cell__ft">
					    </div>
					  </a>
					  <a class="weui-cell weui-cell_access" href="javascript:;">
					  	<div class="weui-cell__hd">
					  		<img src="" style="width: 20px;margin-right: 5px;display: block;"></div>
					    <div class="weui-cell__bd">
					      <p>常州武进区武宜中路181号</p>
					    </div>
					    <div class="weui-cell__ft">
					    </div>
					  </a>
					  <a class="weui-cell weui-cell_access" href="javascript:;">
					  	<div class="weui-cell__hd">
					  		<img src="" style="width: 20px;margin-right: 5px;display: block;"></div>
					    <div class="weui-cell__bd">
					      <p>13776523446</p>
					    </div>
					    <div class="weui-cell__ft">
					    </div>
					  </a>
					  <a class="weui-cell weui-cell_access" href="javascript:;">
					  	<div class="weui-cell__hd">
					  		<img src="" style="width: 20px;margin-right: 5px;display: block;"></div>
					    <div class="weui-cell__bd">
					      <p>关于我们</p>
					    </div>
					    <div class="weui-cell__ft">
					    </div>
					  </a>
					</div>
				</div>
			</div>
			<!-- tabbar -->
			<div class="weui-navTab">
		      <div class="weui-tabbar">
		        <a href="../../index.html" class="weui-tabbar__item">
		          <div class="weui-tabbar__icon">
		            <img src="http://jqweui.com/dist/demos/images/icon_nav_button.png" alt="">
		          </div>
		          <p class="weui-tabbar__label">我要报修</p>
		        </a>
		        <a href="./repair-order.html" class="weui-tabbar__item">
		          <div class="weui-tabbar__icon">
		            <img src="http://jqweui.com/dist/demos/images/icon_nav_msg.png" alt="">
		          </div>
		          <p class="weui-tabbar__label">报修订单</p>
		        </a>
		        <a href="javascript:;" class="weui-tabbar__item weui-bar__item--on">
		          <div class="weui-tabbar__icon">
		            <img src="http://jqweui.com/dist/demos/images/icon_nav_cell.png" alt="">
		          </div>
		          <p class="weui-tabbar__label">个人中心</p>
		        </a>
		      </div>
	      	</div>
		</div>
	</div>
	<script src="../js/vue.min.js"></script>
	<script src="../js/jquery.min.js"></script>
	<script src="../js/jquery-weui.min.js"></script>
	<script src="../js/canvas.js"></script>
	<script>
	var vm = new Vue({
		el:"#app",
		data:{
			message:"hello vue"
		}
	})
	</script>
</body>
</html>